<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>搜索结果 - 音乐NFT平台</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" rel="stylesheet">
</head>
<body class="bg-gray-100">
    <div class="flex h-screen bg-gray-100">
        <!-- 侧边栏 (与首页相同) -->
        
        <!-- 主内容区 -->
        <div class="flex-1 flex flex-col overflow-hidden">
            <!-- 顶部导航 (使用新的带钱包集成的导航) -->
            
            <!-- 滚动内容区 -->
            <main class="flex-1 overflow-y-auto bg-gray-100">
                <div class="max-w-7xl mx-auto py-6 sm:px-6 lg:px-8">
                    <h1 class="text-3xl font-bold mb-6">搜索结果: "电子音乐"</h1>
                    
                    <!-- 选项卡 -->
                    <div class="mb-6">
                        <nav class="flex space-x-4" aria-label="Tabs">
                            <button class="bg-white px-3 py-2 font-medium text-sm rounded-md text-pink-700 bg-pink-100">
                                全部 (15)
                            </button>
                            <button class="text-gray-500 hover:text-gray-700 px-3 py-2 font-medium text-sm rounded-md">
                                NFTs (8)
                            </button>
                            <button class="text-gray-500 hover:text-gray-700 px-3 py-2 font-medium text-sm rounded-md">
                                艺术家 (3)
                            </button>
                            <button class="text-gray-500 hover:text-gray-700 px-3 py-2 font-medium text-sm rounded-md">
                                音乐 (4)
                            </button>
                        </nav>
                    </div>
                    
                    <!-- 搜索结果 -->
                    <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6">
                        <!-- NFT结果 -->
                        <div class="bg-white rounded-lg shadow-md overflow-hidden">
                            <img src="https://images.unsplash.com/photo-1470225620780-dba8ba36b745?ixlib=rb-1.2.1&auto=format&fit=crop&w=300&q=80" alt="NFT Cover" class="w-full h-48 object-cover">
                            <div class="p-4">
                                <h3 class="font-semibold text-lg mb-1">电子音乐集Vol.1</h3>
                                <p class="text-sm text-gray-500 mb-2">DJ Electro</p>
                                <span class="text-lg font-bold text-pink-600">0.05 ETH</span>
                            </div>
                        </div>
                        
                        <!-- 艺术家结果 -->
                        <div class="bg-white rounded-lg shadow-md overflow-hidden">
                            <div class="p-4 flex items-center">
                                <img src="https://images.unsplash.com/photo-1549213783-8284d0336c4f?ixlib=rb-1.2.1&auto=format&fit=crop&w=300&q=80" alt="Artist Avatar" class="w-16 h-16 rounded-full object-cover mr-4">
                                <div>
                                    <h3 class="font-semibold text-lg">DJ Electro</h3>
                                    <p class="text-sm text-gray-500">电子音乐制作人</p>
                                    <button class="mt-2 bg-pink-600 text-white px-4 py-1 rounded-full text-sm hover:bg-pink-700 transition duration-300">
                                        关注
                                    </button>
                                </div>
                            </div>
                        </div>
                        
                        <!-- 音乐结果 -->
                        <div class="bg-white rounded-lg shadow-md overflow-hidden">
                            <div class="p-4">
                                <h3 class="font-semibold text-lg mb-1">电子节奏</h3>
                                <p class="text-sm text-gray-500 mb-2">BeatMaster</p>
                                <audio controls class="w-full">
                                    <source src="path_to_audio_file.mp3" type="audio/mpeg">
                                    您的浏览器不支持音频元素。
                                </audio>
                            </div>
                        </div>
                        
                        <!-- 可以继续添加更多搜索结果 -->
                    </div>
                </div>
            </main>
            
            <!-- 底部播放器 (与首页相同) -->
        </div>
    </div>
</body>
</html>
